
<template>
  <div id="box">
    <input type="number" v-model="num1" id="" />
    <select name="" id="set" v-model="send">
      <option value="+">+</option>
      <option value="-">-</option>
      <option value="*">*</option>
      <option value="/">/</option>
      <option value="%">%</option>
      <option value="**">**</option>
    </select>
    <input type="number" v-model="num2" id="" />
    <button @click="fun()">=</button>
    <input type="number" v-model="num3" id="" />
    <!-- <h4 id="h4"></h4> -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      num1: "",
      num2: "",
      num3: "",
      send:'+'
    };
  },
  methods: {
    fun: function () {
      if (this.send == "+") {
        this.num3 = Number(this.num1) + Number(this.num2);
      } else if (this.send == "-") {
        this.num3 = Number(this.num1) - Number(this.num2);
      } else if (this.send == "*") {
        this.num3 = Number(this.num1) * Number(this.num2);
      } else if (this.send == "/") {
        this.num3 = Number(this.num1) / Number(this.num2);
      } else if (this.send == "%") {
        this.num3 = Number(this.num1) % Number(this.num2);
      } else if (this.send == "**") {
        this.num3 = Number(this.num1) ** Number(this.num2);
      }
    },
  },
};
</script>

